<%--
  Created by IntelliJ IDEA.
  User: SXLWTT
  Date: 2021/11/2
  Time: 14:08
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <script src="/js/jquery-1.9.1.min.js"></script>
    <script src="/js/fileupload.js"></script>
    <script src="/jquery-validate/jquery.validate.min.js"></script>
    <script src="/jquery-validate/messages_zh.js"></script>
    <script src="/jquery-validate/validate.js"></script>
    <link rel="stylesheet" href="/css/img.css">
    <link rel="stylesheet" href="/bootstrap-4.6.0-dist/css/bootstrap.min.css">
    <script src="My97DatePicker/WdatePicker.js"></script>
</head>
<body>
<form action="/update.do" method="post">
    <input type="hidden" name="cid" value="${param.cid}">
    <input type="hidden" name="shenga">
    <input type="hidden" name="shia">
    <input type="hidden" name="xiana">
    食堂名称：<input type="text" name="cname" class="required"><br>
    建立时间：<input type="text" name="opentime" onclick="WdatePicker()"><br>
    状态：  <input type="radio" name="flag" value="China">中式
            <input type="radio" name="flag" value="USA">美式
            <input type="radio" name="flag" value="JAP">日式
    <br><br><br>
    图片：<div class="photoUpLoad" >
    <input type="file"   class="photo" name="photo" accept="image/*"><span class="cross">+</span>
    <img src="" alt="" class="photoEcho">
</div><br>
    省：<select name="sheng">
    <option value="">请选择</option>
</select>
    市：<select name="shi">
    <option value="">请选择</option>
</select>
    县：<select name="xian">
    <option value="">请选择</option>
</select>
    <%--地址<input type="text" name="addr"><br>--%>
    <br>食材：<div id="div"></div>
    <input type="submit">
</form>
</body>
</html>
<script>
    // processData:false,
    //contentType:false
    //获取食材
    $.ajax({
        url:"listFood.do",
        type:"post",
        dataType:"json",
        success:function (obj) {
            for (var i in obj){
                $("#div").append("<input type='checkbox' name='fids' value='"+obj[i].fid+"'>"+obj[i].fname)
            }
        }
    })
    //三级联动
    $(function () {
        $.ajax({
            url:"listCity.do",
            data:{pid:0},
            type:"post",
            dataType:"json",
            success:function (obj) {
                for (var i in obj){
                    if ($("[name='shenga']").val()==obj[i].id){
                        $("[name='sheng']").append("<option selected value='"+obj[i].id+"'>"+obj[i].name+"</option>")
                        $("[name='sheng']").trigger("change")
                    }
                    else {
                        $("[name='sheng']").append("<option value='"+obj[i].id+"'>"+obj[i].name+"</option>")
                        $("[name='sheng']").trigger("change")
                    }

                }
            }
        })

        $("[name='sheng']").change(function () {
            $("[name='shi']").empty()
            $("[name='shi']").append("<option value=''>请选择</option>")
            $("[name='xian']").empty()
            $("[name='xian']").append("<option value=''>请选择</option>")
            var aaa= $("[name='sheng']").val()
            $.ajax({
                url:"listCity.do",
                data:{pid:aaa},
                type:"post",
                dataType:"json",
                success:function (obj) {
                    for (var i in obj){
                        if ($("[name='shia']").val()==obj[i].id){
                            $("[name='shi']").append("<option selected value='"+obj[i].id+"'>"+obj[i].name+"</option>")
                            $("[name='shi']").trigger("change")
                        }else {
                            $("[name='shi']").append("<option value='"+obj[i].id+"'>"+obj[i].name+"</option>")
                            $("[name='shi']").trigger("change")
                        }

                    }
                }
            })
        })
        $("[name='shi']").change(function () {
            $("[name='xian']").empty()
            $("[name='xian']").append("<option value=''>请选择</option>")
            var aaa= $("[name='shi']").val()
            $.ajax({
                url:"listCity.do",
                data:{pid:aaa},
                type:"post",
                dataType:"json",
                success:function (obj) {
                    for (var i in obj){
                        if ($("[name='xiana']").val()==obj[i].id){
                            $("[name='xian']").append("<option selected value='"+obj[i].id+"'>"+obj[i].name+"</option>")
                            $("[name='xian']").trigger("change")
                        }else {
                            $("[name='xian']").append("<option value='"+obj[i].id+"'>"+obj[i].name+"</option>")
                            $("[name='xian']").trigger("change")
                        }

                    }
                }
            })
        })
        /*$("[name='xian']").change(function () {
          var a1=  $("[name='sheng']").val()
          var a2=  $("[name='shi']").val()
          var a3=  $("[name='xian']").val()
            $("[name='addr']").val(a1+a2+a3)
        })*/
    })
    //回显
    $.ajax({
        url:"listHui.do",
        data:{cid:${param.cid}},
        type:"post",
        dataType:"json",
        success:function (obj) {
            console.log(obj)
            $("[name='cname']").val(obj.cname)
            $("[name='opentime']").val(obj.opentime)
            $(".photoEcho").prop("src",obj.pic)
            $("[name='flag'][value='"+obj.flag+"']").prop("checked",true)
            $("[name='shenga']").val(obj.sheng)
            $("[name='shia']").val(obj.shi)
            $("[name='xiana']").val(obj.xian)
            var fid = obj.fnames.split(",");
            for (var i in fid){
                $("[name='fids'][value='"+fid[i]+"']").prop("checked",true)
            }
        }
    })


    $("form").validate({
        submitHandler:function (){
            var formData = new FormData($("form")[0]);
            console.log(formData)
            $.ajax({
                url:"update.do",
                data:formData,
                type:"post",
                dataType:"json",
                success:function (obj){
                    if (obj>0){
                        alert("修改成功")
                        location="list.do"
                    }
                },processData:false,
                contentType:false
            })
        }
        })
</script>
